import { Component, Emit, Prop, Watch } from 'vue-facing-decorator'
import Render from '@/render/Render'
import toNative from '@/utils/toNative'
import renderModal, {
    getModelValue,
    initModelValue,
    type FormModalDto
} from '@/components/modal/Modal'
import { exportOccupation } from '@/api/insureIndustry'
import { downloadBlobFile } from '@/utils/util'
import useConfigStore from '@/stores/config'
@Component
export class ExportWorkTypesPop extends Render {
    @Prop({ default: false }) show!: boolean
    @Emit('update:show')
    showChange(val: boolean) {
        return val
    }

    @Emit('refresh')
    handleRefresh() {}

    @Watch('show', { immediate: true })
    async handleWatchShow() {
        this.formConfig.show = this.show
    }
    @Watch('formConfig.show', { immediate: true })
    handleWatchShowDialog() {
        this.showChange(this.formConfig.show)
    }
    formConfig = this.initFormConfig() as FormModalDto
    initFormConfig() {
        return {
            title: '工种导出',
            width: '450px',
            theme: 'dark',
            show: false,
            params: {
                confirmText: '确定'
            },
            items: {
                insureCompanyCode: {
                    name: '导出保司',
                    element: 'select',
                    optionsType: 'insureCompany',
                }
            },
            complete: async () => {
                const data = getModelValue(this.formConfig)
                console.log(data, 'datadata')
                const res = await exportOccupation(data.insureCompanyCode)
                downloadBlobFile(res, useConfigStore().downloadFileName)
                this.formConfig.show = false
            },
            cancel: () => {
                this.formConfig.show = false
            }
        } as FormModalDto
    }
    render() {
        return <>{renderModal(this.formConfig)}</>
    }
}

export default toNative<{}, { refresh: () => void }>(ExportWorkTypesPop)
